<!--<template>-->
<!--  <div class="app-container home">-->
<!--    &lt;!&ndash;    <basic-container>&ndash;&gt;-->
<!--    <div style="height: 100%;">-->
<!--      <el-row>-->
<!--        <el-form-->
<!--          ref="form"-->
<!--          label-position="right"-->
<!--          :model="queryParams"-->
<!--          label-width="100px"-->
<!--          size="medium"-->
<!--          class="bed-form"-->
<!--        >-->
<!--          <el-row>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="所属区划">-->
<!--                <select-area v-model="queryParams.areaCode" @area-change="areaChange"></select-area>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="机构名称">-->
<!--                <select-company v-model="queryParams.id" :pre-value="queryParams.areaCode" :clearable="true"-->
<!--                                @company-change="companyChange"></select-company>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-button class="search-btn" type="primary" size="mini" @click="handleQuery">-->
<!--                查询-->
<!--              </el-button>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--        </el-form>-->
<!--      </el-row>-->
<!--      <el-row style="margin-top: 15px;">-->
<!--        <el-col :span="4">-->
<!--          <DataCard :count="orgNumber" :icon="gldslIcon" :title="'机构数量'"/>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <DataCard :icon="fjqyslIcon" :title="'人员数量'" :count="personNumber"/>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <DataCard :icon="ljsrrsIcon" :title="'当日出勤人数'" :count="todayRenew"/>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <DataCard :icon="dqszrsIcon" :title="'当日未出勤人数'" :count="todayNotRenew"/>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <DataCard :icon="dxsfjsIcon" :title="'当日未做核酸人数'" :count="todayNotNa"/>-->
<!--        </el-col>-->
<!--        <el-col :span="4">-->
<!--          <DataCard :icon="gzryslIcon" :title="'累计出勤人数'" :count="cumulativeRenew"/>-->
<!--        </el-col>-->
<!--      </el-row>-->
<!--      <el-row class="charts_content">-->
<!--        <el-col :span="11" :offset="1">-->
<!--          <span style="background-color: #E6E6E6">近7日出勤情况</span>-->
<!--          <div class="block">-->
<!--            <line-chart :height="'100%'" ref="lineChart"/>-->
<!--          </div>-->
<!--        </el-col>-->
<!--        <el-col :span="12">-->
<!--          <span style="background-color: #E6E6E6">近7日健康登记情况</span>-->
<!--          <div class="block">-->
<!--            <columnar-chart :height="'100%'" ref="ColumnarChart"/>-->
<!--          </div>-->
<!--        </el-col>-->
<!--      </el-row>-->
<!--    </div>-->
<!--    &lt;!&ndash;    </basic-container>&ndash;&gt;-->
<!--  </div>-->
<!--</template>-->

<!--<script>-->

<!--import DataCard from '@/views/homeIndex/DataCard/index'-->
<!--import LineChart from '@/views/homeIndex/LineChart'-->
<!--import ColumnarChart from '@/views/homeIndex/ColumnarChart'-->
<!--import {getHomeIndexDataCardList, getLineChart, getBarChart} from '@/api/business/homeIndex'-->

<!--export default {-->
<!--  // eslint-disable-next-line vue/multi-word-component-names-->
<!--  name: "Index",-->
<!--  components: {DataCard, LineChart, ColumnarChart},-->
<!--  data () {-->
<!--    return {-->
<!--      queryParams: {},-->
<!--      orgNumber: 0,-->
<!--      personNumber: 0,-->
<!--      todayRenew: 0,-->
<!--      todayNotRenew: 0,-->
<!--      todayNotNa: 0,-->
<!--      cumulativeRenew: 0,-->
<!--      gldslIcon: require('@/assets/images/gldsl.png'),-->
<!--      fjqyslIcon: require('@/assets/images/fjqysl.png'),-->
<!--      dqszrsIcon: require('@/assets/images/dqsz.png'),-->
<!--      ljsrrsIcon: require('@/assets/images/ljsrrs.png'),-->
<!--      dxsfjsIcon: require('@/assets/images/fjqysl.png'),-->
<!--      gzryslIcon: require('@/assets/images/gzrys.png'),-->
<!--    };-->
<!--  },-->
<!--  mounted () {-->
<!--    this.getLoginUser()-->
<!--    this.handleQuery()-->
<!--  },-->
<!--  methods: {-->
<!--    getLoginUser () {-->
<!--      const user = this.$store.state.user.userInfo-->
<!--      this.queryParams.areaCode = user.areaCode-->
<!--      this.queryParams.id = user.id-->
<!--    },-->
<!--    /** 查询区域 */-->
<!--    areaChange (value) {-->
<!--      this.queryParams.areaCode = value-->
<!--      this.deptOptions = []-->
<!--      this.queryParams.deptId = undefined-->
<!--    },-->
<!--    /** 查询机构 */-->
<!--    companyChange (item) {-->
<!--      this.queryParams.id = item.id-->
<!--    },-->
<!--    handleQuery () {-->
<!--      this.getHomeIndexDataCardList()-->
<!--    },-->
<!--    // 查询首页 上部card-->
<!--    getHomeIndexDataCardList () {-->
<!--      getHomeIndexDataCardList(this.queryParams).then(res => {-->
<!--        let data = res.data-->
<!--        this.orgNumber = data.orgNumber-->
<!--        this.personNumber = data.personNumber-->
<!--        this.todayRenew = data.todayRenew-->
<!--        this.todayNotRenew = data.todayNotRenew-->
<!--        this.todayNotNa = data.todayNotNa-->
<!--        this.cumulativeRenew = data.cumulativeRenew-->
<!--      })-->
<!--      this.getLineChar()-->
<!--      this.getColumnarChart()-->
<!--    },-->
<!--    /** 查询首页 折线图 */-->
<!--    getLineChar () {-->
<!--      getLineChart(this.queryParams).then(res => {-->
<!--        console.log('折线图', res)-->
<!--        this.$refs.lineChart.setLineData(res.data)-->
<!--      })-->
<!--    },-->
<!--    /** 查询首页 柱状图 */-->
<!--    getColumnarChart () {-->
<!--      getBarChart(this.queryParams).then(res => {-->
<!--        console.log('柱状图', res)-->
<!--        this.$refs.ColumnarChart.setLineData(res.data)-->
<!--      })-->
<!--    },-->
<!--  },-->
<!--};-->
<!--</script>-->

<!--<style scoped lang="scss">-->

<!--.block {-->
<!--  width: 100%;-->
<!--  height: 100%;-->
<!--  background-color: #fff;-->
<!--}-->

<!--.search-btn {-->
<!--  width: 60px;-->
<!--  margin-left: 15px;-->
<!--  margin-top: 4px;-->
<!--}-->

<!--.home {-->
<!--  blockquote {-->
<!--    padding: 10px 20px;-->
<!--    margin: 0 0 20px;-->
<!--    font-size: 17.5px;-->
<!--    border-left: 5px solid #eee;-->
<!--  }-->

<!--  hr {-->
<!--    margin-top: 20px;-->
<!--    margin-bottom: 20px;-->
<!--    border: 0;-->
<!--    border-top: 1px solid #eee;-->
<!--  }-->

<!--  .col-item {-->
<!--    margin-bottom: 20px;-->
<!--  }-->

<!--  ul {-->
<!--    padding: 0;-->
<!--    margin: 0;-->
<!--  }-->

<!--  font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;-->
<!--  font-size: 13px;-->
<!--  color: #676a6c;-->
<!--  overflow-x: hidden;-->

<!--  ul {-->
<!--    list-style-type: none;-->
<!--  }-->

<!--  h4 {-->
<!--    margin-top: 0px;-->
<!--  }-->

<!--  h2 {-->
<!--    margin-top: 10px;-->
<!--    font-size: 26px;-->
<!--    font-weight: 100;-->
<!--  }-->

<!--  p {-->
<!--    margin-top: 10px;-->

<!--    b {-->
<!--      font-weight: 700;-->
<!--    }-->
<!--  }-->

<!--  .update-log {-->
<!--    ol {-->
<!--      display: block;-->
<!--      list-style-type: decimal;-->
<!--      margin-block-start: 1em;-->
<!--      margin-block-end: 1em;-->
<!--      margin-inline-start: 0;-->
<!--      margin-inline-end: 0;-->
<!--      padding-inline-start: 40px;-->
<!--    }-->
<!--  }-->
<!--}-->

<!--.charts_content{-->
<!--  height: calc(100% - 207px);-->
<!--  margin-top: 30px;-->
<!--  > div{-->
<!--    height: 100%;-->
<!--    > div{-->
<!--      height: calc(100% - 14px);-->
<!--    }-->
<!--  }-->
<!--}-->
<!--</style>-->

